<template>
    <div>
        {{ info }}
        <table>
            <thead>
                <tr>
                    <td>标题</td>
                    <td><input type="text" v-model="info.text" ></td>
                </tr>
                <tr>
                    <td>副标题</td>
                    <td><input type="text" v-model="info.fText" ></td>
                </tr>
                <tr>
                    <td>栏目分类</td>
                    <td>
                        <select v-model="info.lid" >
                            <option value="">请选择</option>
                            <option :value="o.lid" v-for="o in Von" >{{ o.lName }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>图片</td>
                    <td><input type="file" @change="img" >
                    <img :src="info.img" width="60" height="60" ></td>
                </tr>
                <tr>
                    <td>价格</td>
                    <td><input type="text" v-model="info.money" ></td>
                </tr>
                <tr>
                    <td>颜色</td>
                    <td><input type="text" v-model="info.cole" ></td>
                </tr>
            

                <tr>
                    <td></td>
                    <td><input type="button" value="添加" @click="Login" ></td>
                </tr>
            </thead>
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { onMounted, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';

const router=useRouter();
const route=useRoute();

let Von:any=ref([]);


let info:any=ref({
   "pid": route.query.id,
  "text": "",
  "fText": "",
  "lid": "",
  "img": "",
  "money": "",
  "cole": "",
  "isDell": 0
});

onMounted(()=>{
    List();
    Fand();
})

const Fand=()=>{
    axios({
        url:'https://localhost:7073/api/User/Fand',
        method:'get',
        params:{
            id:route.query.id
        }
    })
    .then((res)=>{
        console.log(res);
        Object.assign(info.value,res.data );
    } )

}

const Upda=()=>{
    router.push({
        path:'/Show',
    })
}

const Login=()=>{
    if(info.value.text=="" )
{
    alert("标题不为空");
    return;
}
    if(info.value.fText=="" )
{
    alert("分标题不为空");
    return;
}
if(info.value.lid=="" )
{
    alert("栏目不为空");
    return;
}
if(info.value.money=="" )
{
    alert("价格不为空");
    return;
}
if(info.value.cole=="" )
{
    alert("颜色不为空");
    return;
}
if(info.value.dateTime=="" )
{
    alert("时间不为空");
    return;
}
    let f=confirm("要修改吗")
    if(f){
        axios({
        url:'https://localhost:7073/api/User/Update',
        method:'post',
        data:info.value
    })
    .then((res)=>{
        console.log(res);
        
       
       if(res.data>0 )
    {
        alert("成功");
        Upda();
    }

    } )
    }
    
}

const List=()=>{
    axios({
        url:'https://localhost:7073/api/User/List',
        method:'get',
    })
    .then((res)=>{
        console.log(res);
        Von.value=res.data;        
    })
    
}

const img=(e:any)=>{
    console.log(e);
    let obj=e.target.files[0];
    let fs=new FormData();
    fs.append("file",obj );

    axios({
        url:'https://localhost:7073/api/Img',
        method:'post',
        data:fs
    })
    .then((res)=>{
        console.log(res);
        info.value.img=res.data;
    })
}

</script>

<style scoped>

</style>